<template>
    <el-dialog
        title="数据库连接设置"
        :close-on-click-modal="false"
        style="width: 600px"
        v-model="testConnDialog.visible">
        <el-form v-model="dataSourceForm" label-width="70px" label-position="left">

            <el-form-item
                label="驱动名称">
                <el-input v-model="dataSourceForm.driver" type="text" placeholder="请输入驱动名称"/>
            </el-form-item>

            <el-form-item
                label="url地址">
                <el-input v-model="dataSourceForm.url" type="text" placeholder="请输入url地址"/>
            </el-form-item>

            <el-form-item
                label="用户名">
                <el-input v-model="dataSourceForm.username" type="text" placeholder="请输入用户名"/>
            </el-form-item>

            <el-form-item
                label="密码">
                <el-input v-model="dataSourceForm.password" type="text" placeholder="请输入密码"/>
            </el-form-item>

            <el-form-item>
                <el-alert title="连接成功!" type="success" :closable="false"
                          v-if="codeGeneratorStore.isConnected === 1"/>
                <el-alert title="连接失败!" type="danger" :closable="false"
                          v-if="codeGeneratorStore.isConnected === -1"/>
            </el-form-item>

        </el-form>
        <template #footer>
            <el-button type="default" @click="handleCloseConnDialogClick">关闭</el-button>
            <el-button type="primary" @click="handleConnectionTestClick">连接测试</el-button>
        </template>
    </el-dialog>
</template>

<script setup>
import {useCodeGeneratorStore} from "../../store/module/useCodeGenerator.js";
import {ref} from "vue";
import {doConnectionTest} from "../../request/index.js";

const codeGeneratorStore = useCodeGeneratorStore()

const dataSourceForm = ref({
    driver: 'com.mysql.cj.jdbc.Driver',
    url: 'jdbc:mysql://localhost:3306/rabbit_template?useUnicode=true&characterEncoding=UTF-8&useSSL=false&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghai',
    username: 'root',
    password: '123456',
})

const testConnDialog = ref({
    visible: false,
})

// 连接测试按钮事件
const handleConnectionTestClick = () => {
    doConnectionTest(dataSourceForm.value).then(res => {
        console.log('res:', res)
    }).catch(err => {
        console.log('err:', err)
    })
}

// 打开数据库连接信息录入对话框
const handleOpenAddDatabaseConnClick = () => {
    testConnDialog.value.visible = true
}

// 关闭添加数据库连接
const handleCloseConnDialogClick = () => {
    testConnDialog.value.visible = false
}
</script>

<style scoped lang="less">

</style>
